<template>
  <div>
    <!--条件筛选-->
    <TopFilter :list="topFilterList" :cols="4" labelWidth="85" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <!--操作 -->
    <button-area :style="{ paddingLeft: '80px' }"></button-area>
    <!-- 列筛选-->
    <FilterTable
      ref="table"
      columnsRef="part_report_fibOrderExecution"
      :columns="columns"
      :onRowSelectChange="handleRowSelectChange"
      selectionType="single"
      :isSelectColumn="true"
      :dataSource="tableDataList"
      :isMemoryPagination="true"
      :onColumnsChange="columns => (this.columns = columns)"
      :isExportExcel="true"
      :onCalcExportData="exportFun"
      exportFileName="查询FIB订单执行情况.xlsx"
    >
      <!-- :datakey="'rows'" -->
      <!-- :fetchapi="fetchApi"
      :params="fetchParams" -->
      <template slot="controls">
        <!-- <el-button size="small" type="primary" @click="handleUpload">上传</el-button> -->
        <el-button size="small" type="primary" @click="clickHandle">主机厂备货情况查询</el-button>
      </template>
    </FilterTable>

    <!--对话框-->
    <BaseDialog :visible.sync="visible1" title="主机厂备货情况查询" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <StoreDetail :fetchapi="partExecutionSupplyListApi" :type="handleType" :rowData="selectedList" @close="closeHandler" />
    </BaseDialog>
  </div>
</template>

<script>
import { messageAction } from '@/utils';
import { dictionary } from '@/utils/dictMixin';
import { authority } from '@/utils/authMixin';
import { getExecutionList, getExecutionSupplyList } from '@/api/part/report/fibOrderExecution';
import StoreDetail from './storeDetail';
import moment from 'moment';
// // // import res from '@/mock/tableData';
// 维护工具主文件
export default {
  name: 'zxWhMainPage',
  components: {
    StoreDetail
  },
  mixins: [dictionary],
  data() {
    return {
      topFilterList: this.createTopFilterList(),
      fetchParams: { xhrAbort: true },
      dialogTitle: '',
      selectedList: [], // 选中的列表
      fetchApi: getExecutionList,
      partExecutionSupplyListApi: getExecutionSupplyList,
      visible1: false,
      columns: this.createTableColumns(),
      handleType: '',
      formData: {},
      tableDataList: []
    };
  },
  mounted() {
    // 分页
    this.BaseTable = this.$refs.table.$refs.pageTable;
  },
  methods: {
    // 导出方法
    exportFun(row) {
      if (row.REFER_PRICE) {
        row.REFER_PRICE = Number(row.REFER_PRICE * (1 + Number(this.tax))).toFixed(2);
      }
      // for (const key in row) {
      //   switch (key) {
      //     case 'LAST_STOCK_IN':
      //     case 'LAST_STOCK_OUT':
      //     case 'FOUND_DATE':
      //     case 'STOCK_AGE_DATE':
      //       if (row[key]) {
      //         row[key] = moment(row[key]).format('YYYY-MM-DD');
      //       }
      //       break;
      //     case 'CONSULTANT':
      //       if (row[key]) {
      //         // row[key] = this.userList[row[key]];
      //       }
      //       break;
      //     case 'STOCK_QUANTITY':
      //     case 'LEND_QUANTITY':
      //       if (row[key]) {
      //         row[key] = Number(row[key]).toFixed(2);
      //       }
      //       break;
      //     default:
      //       break;
      //   }
      // }
    },
    // 点击事件
    clickHandle() {
      if (this.selectedList.length < 1) {
        return this.$notify.error({ title: '提示信息', message: '请选中一条信息' });
      }
      this.visible1 = true;
    },
    createTopFilterList() {
      return [
        {
          type: 'INPUT',
          label: '订货申请单号',
          fieldName: 'I_QVBELN'
        },
        {
          type: 'RANGE_DATE',
          fieldName: 'I_QERDATS|I_QERDATE',
          initialValue: [
            moment()
              .startOf('month')
              .format('YYYY-MM-DD'),
            moment().format('YYYY-MM-DD')
          ],
          label: '订货建立日期'
        },
        {
          type: 'INPUT',
          label: '采购订单号',
          fieldName: 'I_PONUM'
        },
        {
          type: 'INPUT',
          label: '销售订单号',
          fieldName: 'I_SVBELN'
        },
        {
          type: 'INPUT',
          label: '发货单号',
          fieldName: 'I_DVBELN'
        },
        {
          type: 'INPUT',
          label: '底盘号',
          fieldName: 'I_VIN'
        },
        {
          type: 'INPUT',
          label: '配件号',
          fieldName: 'I_MATNR'
        }
      ];
    },
    createTableColumns() {
      return [
        // {
        //   title: '操作',
        //   fixed: 'left',
        //   render: params => {
        //     return (
        //       <div>
        //         <el-button type="text" size="mini" onClick={() => this.handleEdit(params.row)}>
        //           编辑
        //         </el-button>
        //         <el-divider direction="vertical"></el-divider>
        //         <el-button type="text" size="mini" onClick={() => this.handleCheckDetail(params.row)}>
        //           详情
        //         </el-button>
        //       </div>
        //     );
        //   }
        // },
        {
          title: '序号',
          dataIndex: 'index',
          sorter: true,
          width: 70,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        },
        {
          title: '订货申请单号',
          dataIndex: 'QVBELN',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '申请单项号',
          // title: '项号',
          dataIndex: 'QPOSNR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '锁',
          dataIndex: 'DFLAG',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '状态',
          dataIndex: 'VBTYP_N',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '销售订单号',
          dataIndex: 'SVBELN',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '销售订单项号',
          // title: '项号',
          dataIndex: 'SPOSNR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '替',
          dataIndex: 'SPOSNN',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '发货点',
          dataIndex: 'VSTEL',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '类型',
          dataIndex: 'MTPOS',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '经销商采购订单号',
          dataIndex: 'PONUM',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '传',
          dataIndex: 'TFLAG',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '替',
          dataIndex: 'SEBELP',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '到',
          dataIndex: 'SFLAG',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '发货单号',
          dataIndex: 'OUBNR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '发货单项号',
          dataIndex: 'OUBIT',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        // {
        //   title: '是否发往中转库',
        //   dataIndex: 'stockQuantity',
        //   filterType: 'input'
        // },
        {
          title: '底盘号',
          dataIndex: 'FGSTNR',
          width: 140,
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '替换后零件号',
          dataIndex: 'SMATNR',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '建立日期',
          dataIndex: 'ERDAT',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          dateFormat: 'yyyy-MM-dd',
          valueFormat: 'yyyy-MM-dd HH:mm:ss'
        },
        {
          title: '建立时间',
          dataIndex: 'ERZET',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          valueFormat: 'HH:mm:ss'
        },
        {
          title: '服务站代码',
          dataIndex: 'stockQuantity',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        },
        {
          title: '建立人',
          dataIndex: 'ERNAM',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '配件代码',
          dataIndex: 'MATNR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '拒绝原因',
          dataIndex: 'ABGRU',
          sorter: true,
          filter: true,
          showOverflowTooltip: true,
          filterType: 'input'
        }
        // ,
        // {
        //   title: '用户名称',
        //   dataIndex: 'stockQuantity',
        //   filterType: 'input'
        // }
      ];
    },
    handleRowSelectChange(e) {
      this.selectedList = e;
    },
    async changeHandle(val) {
      let conditon = true;
      Object.values(val).forEach(item => {
        if (typeof item == 'string') {
          conditon = false;
        }
        if (typeof item == 'object' && item.length > 1) {
          conditon = false;
        }
      });
      if (conditon) {
        return this.$notify.error({ title: '提示信息', message: '请至少输入一个查询参数' });
      }
      let res = await getExecutionList(val);
      this.tableDataList = res.data;
      // this.fetchParams.xhrAbort = true;
      // this.fetchParams = Object.assign(this.fetchParams, { xhrAbort: false }, val);
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    closeHandler(val, type) {
      // 关闭
      this.visible1 = false;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams.xhrAbort = true;
        this.fetchParams.xhrAbort = false;
        // this.fetchParams = { ...this.fetchParams };
      }
    },
    // 点击上传
    async handleUpload() {
      let res = await PartUploadSPP();
      if (res.resultCode == 200) {
        messageAction('上传成功', 'success');
      }
    }
  }
};
</script>

<style lang="less" scoped></style>
